<template>
  <div class="sidebar">
    <el-icon @click="changToggle">
      <component :is=toggle />
    </el-icon>
    <!-- <el-icon><Expand /></el-icon> -->
  </div>
</template>

<script setup>
import { useStore } from 'vuex'
import { computed } from 'vue'

const store = useStore()
// 调用方法改变状态
const changToggle = () => {
  store.commit('user/setToggle')
}
const toggle = computed(() => {
  return store.state.user.toggleSide ? 'Fold' : 'Expand'
})
console.log(store.state.user.toggleSide)

</script>

<style lang='scss' scoped>
.sidebar{
  margin-right: 15px;
  box-sizing: border-box;
  cursor: pointer;
}
</style>
